<div class="el-tabs el-tabs--top">
  <div class="el-tabs__header is-top">
    <div class="el-tabs__nav-wrap is-top">
      <div class="el-tabs__nav-scroll">
        <div role="tablist" class="el-tabs__nav is-top" style="transform: translateX(0px);">
          <div class="el-tabs__active-bar is-top" style="width: 56px; transform: translateX(96px);"></div>
          <div id="tab-first" aria-controls="pane-first" role="tab" tabindex="-1" class="el-tabs__item is-top">用户管理
          </div>
          <div id="tab-second" aria-controls="pane-second" role="tab" aria-selected="true" tabindex="0"
            class="el-tabs__item is-top is-active">配置管理</div>
          <div id="tab-third" aria-controls="pane-third" role="tab" tabindex="-1" class="el-tabs__item is-top">角色管理
          </div>
          <div id="tab-fourth" aria-controls="pane-fourth" role="tab" tabindex="-1" class="el-tabs__item is-top">定时任务补偿
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="el-tabs__content">
    <div role="tabpanel" aria-hidden="true" id="pane-first" aria-labelledby="tab-first" class="el-tab-pane"
      style="display: none;">用户管理</div>
    <div role="tabpanel" id="pane-second" aria-labelledby="tab-second" class="el-tab-pane">配置管理</div>
    <div role="tabpanel" aria-hidden="true" id="pane-third" aria-labelledby="tab-third" class="el-tab-pane"
      style="display: none;">角色管理</div>
    <div role="tabpanel" aria-hidden="true" id="pane-fourth" aria-labelledby="tab-fourth" class="el-tab-pane"
      style="display: none;">定时任务补偿</div>
  </div>
</div>